<template>
  <Card>
    <Spin fix v-if="loading.status">
      <Icon type="load-c" size=18 class="demo-spin-icon-load"></Icon>
      <div v-text="loading.text"></div>
    </Spin>
    <p slot="title">
      <Icon type="person"></Icon>修改密码
    </p>
    <Form :model="user" label-position="top" :label-width="100">
      <FormItem label="登录账户名:">
        <Input v-model="user.account" readonly/>
      </FormItem>
      <FormItem label="请输入旧密码:">
        <Input v-model="user.password" type="password" placeholder="请输入旧密码"/>
      </FormItem>
      <FormItem label="请输入新密码:">
        <Input v-model="user.new_password" type="password" placeholder="请输入新密码"/>
      </FormItem>
      <FormItem label="重新输入新密码:">
        <Input v-model="user.new_password2" type="password" placeholder="请重新输入新密码"/>
      </FormItem>
      <FormItem>
      <Button type="primary" @click="resetPassword()">提交</Button>
      </FormItem>
    </Form>
  </Card>
</template>
<script>
  import profile from '@/models/setting/my/profile'
  import Spin from 'iview/src/components/spin/spin'
  import md5 from 'js-md5'

  export default {
    components: {Spin},
    name: 'my_profile_profile',
    data () {
      return {
        user: {
          password: '',
          name: '',
          new_password: '',
          new_password2: '',
          account: ''
        },
        loading: {
          status: false,
          text: ''
        }
      }
    },
    computed: {
    },
    mounted () {
      this.initLoading()
      profile.get().then(r => {
        if (r.code === 200) {
          this.user = r.user
        } else {
          this.$Message.warning(r.msg)
        }
        this.showLoading(false)
      }).catch(r => {
      })
    },
    methods: {
      resetPassword () {
        this.showLoading(true, '数据提交中')
        this.user.password = md5(this.user.password + 'sys_dshc')
        this.user.password2 = md5(this.user.password2 + 'sys_dshc')
        profile.resetPassword(this.user).then(r => {
          if (r.code === 200) {
            this.$Message.success(r.msg)
            setTimeout(() => {
              window.location.reload()
            }, 1000)
          } else {
            this.$Message.warning(r.msg)
          }
          this.showLoading(false)
        })
      },
      showLoading (status, text = '') {
        this.loading = {
          status: status,
          text: text
        }
      },
      initLoading () {
        this.loading = {
          status: true,
          text: '数据加载中...'
        }
      }
    }
  }
</script>
